<template>
    <div class="create">

        <div class="edit">
            
            <h1>{{WholeSurvey.survey.surTitle}}</h1>
        </div>
        <br/><br/><br/>
        <!-- 遍历循环各个题目 -->
        <div class="items">
            <div v-for="(item,index) in WholeSurvey.wholeTitles" :key="index" >
                <singlechoice   v-if="item.title.type==1" :wholeTitles=item ref="a"></singlechoice>
                <multichoice v-if="item.title.type==2" :wholeTitles=item ref="a"></multichoice>
                <inputbox v-if="item.title.type==3" :wholeTitles=item ref="a"></inputbox>
                <button @click="save()" v-show="false">打印</button>
                <br/><br/><br/>
            </div>  
        </div>
        <el-button @click="send()">提交答卷</el-button>
        <el-button @click="log()" v-show="false">打印</el-button>

    </div>
</template>

<script>
//关于对类型的控制，使用if--else进行选择判断
import singlechoice from './options/singleChoice'   
import multichoice from './options/multiChoice'
import inputbox from './options/inputBox'

export default {
    data () {
        return {
            imgSrc:require('../.././assets/bga.jpg'),


            pathValue: '',
            subindex: 6,               //子组件的下标（从1开始算）
            count: 1,               //题目数量
            choiceType: 1,         //添加类型
            typeForm:[{             //类型选择框
                type: 1,
                label: '单选'
            },{
                type: 2,
                label: '多选'
            },{
                type: 3,
                label: '单填'
            },],
            WholeAnswer:{
                answer:{
                    ansId:'',
                    surId:'12',
                    ansDate:'2021-6-1'
                },
                details:[]
            },
            //问卷信息
            WholeSurvey:{
                userId:'',
                userName:'',
                survey: {
                    surId: '',
                    userId: '3',
                    state:'1',  //1:未发布2：已发布
                    surTitle:'问卷题目',
                    surDate:'6',
                    surNum:'',    //感觉不需要，先放着
                },
                 wholeTitles:[{                  
                    title:{
                        type:'',
                        must: '',
                        content:'',
                        titNum:'',
                    },
                    choices: [                       //选项的信息  
                        {
                        choiceNum: 1,               //choiceNum表示选项号 
                        content: ''                  //表示内容
                        }]    
                 }],
                 
            }
           
        }
    },
    methods: {
        //发送答卷
        send(){
            // for(var index in this.WholeSurvey.wholeTitles){
            //     if(this.$refs.a[index].wholeTitles.title.must==1&&){

            //     }
            // }
            var flag=false;


            //赋值回答情况
            for(var index in this.WholeSurvey.wholeTitles){
                this.WholeAnswer.details.push(this.$refs.a[index].details)
                //console.log(this.$refs.a[index].details)
                 console.log(this.$refs.a[index].wholeTitles.title.must);
                 console.log(this.$refs.a[index].details.detContent);
                 if(this.$refs.a[index].wholeTitles.title.must==1&&this.$refs.a[index].details.detContent==''){
                     flag=true;
                 }
            }

            this.WholeAnswer.answer.ansDate=new Date().toLocaleString();
            //console.log(this.WholeAnswer);


            if(flag==false){
                this.$axios.post(this.$store.state.url+'/answer/saveAnswer',this.WholeAnswer);
                this.$router.push('/okanswer');
            }
            else{
                //alert("请将所有必选题目都完成后再提交答卷");
                this.$alert('请将所有必选题目都完成后再提交答卷','提示', {
                confirmButtonText: '知道了',})                
            }
             
              //console.log(this.WholeAnswer);

              
        },

        //增加题目
      add(){

      },
        //删除题目
      delTitle(){
          this.WholeSurvey.wholeTitles.pop();
          this.count--;  
      },  
        //打印题目
      log(){
          console.log(this.$refs.a[0].details);
      },
      save(){
          console.log(this.$refs.a.details);
      },

    },
    components: {
        singlechoice,
        multichoice,
        inputbox
    },
    created () {
        //创建的时候就获取id
        // console.log(this.$route.params.surId);
        this.pathValue=this.$route.params.surId;

        //赋值答卷的surId
        this.WholeAnswer.answer.surId=this.pathValue;


        this.$axios.get(this.$store.state.url+'/answer/'+this.pathValue)
        .then(res=>{
            console.log(res.data);
            if(res.data.code==20000){
                // console.log(this.WholeSurvey.survey);
                this.WholeSurvey=res.data.data.WholeSurvey;
                //console.log(this.WholeSurvey);
                //console.log(res.data.data.WholeSurvey);
            }
            else{
                //处理相应的事件
                this.$alert(res.data.message, '访问失败', {
                confirmButtonText: '知道了',}).then(()=>{
                this.$router.push('/login');
                })
                 
                //console.log(res.data.message);
            }

        })        
    }

}
</script>
<style>
.create{
    float:bottom;
}

.items{

    top: 220px;
   float: inherit;   
}
.input{
    width: 330px;
}
.background{
    width:100%;  
    height:100%;  /**宽高100%是为了图片铺满屏幕 */
    z-index:-1;
    position: absolute;
}
</style>